{extend name='index@Common/index' /} {block name='content'}

<div class="card">
  <div class="card-header  border-t pb-0" style="background-color: #fff">
    <!-- <p><small>查询财务状况或管理优惠券和发票。</small></p> -->
    <div class="tool-list d-flex">
      <ul class="list-inline mr-auto  m-0">
        <li class="list-inline-item p-2">
          <a href="{:url('index/Consumption/list')}" class="fs-16">
            <h4>流水账单 </h4>
          </a>
        </li>
        <li class="list-inline-item p-2 " style="border-bottom:3px solid #108cee;">
          <h4 style="color: #108cee;"> 资源账单</h4>
        </li>

      </ul>
      <!-- <ul class="list-inline m-0">
        <li class="list-inline-item p-2">
          <a href="#"><i class="iconfont iconguanlian1"></i> 操作指南</a>
        </li>
      </ul> -->
    </div>
  </div>
  <div class="card-body fs-12">
    <div class="cont-box">
      <div class="pb-3">
        <div class="form-row m-0">
          <ul class="list-inline mr-auto m-0 form-inline">
            <li class="list-inline-item">
              <select name="" id="" class="form-control form-control-sm">
                <option value="">2019年</option>
                <option value="">2018年</option>
                <option value="">2017年</option>
                <option value="">2016年</option>
                <option value="">2015年</option>
                <option value="">2014年</option>
              </select>
            </li>
            <li class="list-inline-item">
              <select name="" id="" class="form-control form-control-sm">
                <option value="">1月</option>
                <option value="">2月</option>
                <option value="">3月</option>
              </select>
            </li>
            <!-- <li class="list-inline-item">
              <select name="" id="" class="form-control form-control-sm" style="width: 200px">
                <option value="">产品:全部</option>
                <option value="">后付费</option>
                <option value="">预付费</option>
              </select>
            </li> -->
          </ul>
          <ul class="list-inline  m-0 form-inline">
            <!-- <li class="list-inline-item ">
                      <select name="" id="" class="form-control form-control-sm">
                          <option value="">实例ID</option>
                          <option value="">标签</option>
                          <option value="">预付费</option>
                      </select>
                  </li>
                  <li class="list-inline-item form-inline">
                      <div class="input-group input-group-sm">
                          <input type="text" class="form-control form-control-sm" placeholder="请输入实例ID进行搜索">
                          <div class="input-group-append">
                              <button class="btn btn-primary btn-sm"><i class="iconfont iconicon_sousuo-xian"></i></button>
                          </div>
                      </div>
                  </li>
                  <li class="list-inline-item"><button class="btn  btn-light btn-sm"><i class="iconfont iconicon_xiazai"></i></button></li>
                  <li class="list-inline-item"><button class="btn  btn-light btn-sm"><i class="iconfont iconicon_shuaxin"></i></button></li> -->
          </ul>
        </div>
      </div>
      <div class="ml-nge">
        <div>
          <table class="table table-border">
            <thead class="bg-fB p-2">
              <tr class="font-weight-light">
                <th class="px-3">资源ID</th>
                <th>产品名称</th>
                <th>区域</th>
                <th>账单金额</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td>i-EtfjnKTO</td>
                <td>BCC（云服务器）</td>
                <td>华北 - 保定</td>
                <td>￥5.00</td>
                <td><a href="account_resource_detail.html"> 查看详情</a></td>
              </tr>
            </tbody>
          </table>
        </div>
        <div class="d-flex justify-content-between pt-3 pl-3">
          <ul class="mr-auto"></ul>
          <ul class="list-inline form-inline px-2">
            <li class="list-inline-item">每页显示</li>
            <li>
              <select name="" id="" class="form-control form-control-sm">
                <option value="">10</option>
                <option value="">20</option>
                <option value="">30</option>
                <option value="">40</option>
              </select>
            </li>
          </ul>
          <ul class="pagination mb-0">
            <li class="page-item disabled">
              <a class="page-link" href="#" tabindex="-1">&lt;</a>
            </li>
            <li class="page-item">
              <a class="page-link" href="#">1</a>
            </li>
            <li class="page-item active">
              <a class="page-link" href="#">2
                <span class="sr-only">(current)</span>
              </a>
            </li>
            <li class="page-item">
              <a class="page-link" href="#">3</a>
            </li>
            <li class="page-item">
              <a class="page-link" href="#">&gt;</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
{/block} {block name='modal'} {/block} {block name='js'}
<script>
  window.onload = function () {
    $(".account_list").parent().parent().css("display", "block")
    $(".account_list").addClass("border-left");
  }
</script>
{/block}